<template>
	<view class="sendOutGoods">
		<view class="top">
			<image src="/static/img/index/48.png" mode="widthFix"></image>
			<text>除了一些虚拟产品或者买家自提的时候选择“无需物流”</text>
			<image src="/static/img/index/79.png" mode="widthFix"></image>
		</view>
		<view class="content">
			<view class="">
				<text>快递</text>
			<!-- 	<view class="">
					发货方式
					<view class="">
						无需物流
						<image src="/static/img/index/58.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="">
					快递公司
					<view class="">
						请选择快递公司
						<image src="/static/img/index/58.png" mode="widthFix"></image>
					</view>
				</view> -->
				<view class="">
					快递单号
					<view class="">
						<input v-model="data.emsNo" type="text" placeholder="请输入快递单号" />
						
					</view>
					<image @tap="scanCode" style="width:40rpx;margin-left:20rpx;" src="/static/img/index/78.png" mode="widthFix"></image>
		<!-- 			<view class="">
						请输入或扫描快递单号
					</view> -->
				</view>
			</view>
		
		</view>
		<view class="bot">
			<text @tap="submit">提交</text>
		</view>
	</view>
</template>

<script setup lang="ts">
	import {
			reactive,
		} from 'vue';
	import { onLoad } from '@dcloudio/uni-app';
	import {sendOrder,ocrEmsFile} from '@/utils/api/goods'
	import imgUpload from '@/utils/imgUpload.ts'
		import { setDialogView } from '@/utils/dialogView.ts'
	const data = reactive<any>({
		emsNo:''
	})
	onLoad(({id})=>{
		data.id = id;
	})
	const scanCode=()=>{
		uni.showActionSheet({
			itemList:['拍摄','从相册选择'],
			success:(e)=>{
				let key = ''
				if(e.tapIndex == 0){
					key = 'camera'
				}else{
					key = 'album'
				}
				setDialogView(key == 'camera'?'CAMERA':'READ_EXTERNAL_STORAGE').then(res=>{
					if(res == 1){
						uni.chooseImage({
							count: 1,
							sourceType: [key],
							success: (e : any) => {
								imgUpload(e.tempFiles.map((item : any) => { return { ...item, filePath: item.path } }), (e : any) => {
									ocrEmsFile({data:{fileId:e[0].fileId}}).then(res=>{
										data.emsNo=res.data.number
										console.log(res)
										console.log(res.data.number)
									})
								})
								
							}
						})
					}
				})
				
			}
		})
		
	}
	const submit =()=>{
		if(!data.emsNo){
			uni.showToast({
				title:'请输入快递单号!',
				icon:'none'
			})
			return;
		}
		uni.showLoading({
			title:'加载中...',
			mask:true
		})
		sendOrder({data:{orderNo:data.id,emsNo:data.emsNo}}).then((res)=>{
			if(res.code == 200){
				uni.showToast({
					title:'发货成功!',
					icon:'none'
				})
				setTimeout(()=>{
					uni.$emit('orderList',data.id)
					uni.navigateBack();
				},1000)
			}
		})
		
	}
</script>

<style lang="scss">
	input{
		color: #262626;
	}
.sendOutGoods{
	height: 100vh;
	background: #F4F6FA;
	display: flex;
	flex-direction: column;
	>.content{
		flex: 1;
		margin: 24rpx;
		
		>view{
			padding: 24rpx 32rpx;
			border-radius: 24rpx;
			background: #fff;
			>text{
				font-size: 32rpx;
			}
			>view{
				margin-top: 48rpx;
				color: #595959;
				display: flex;
				align-items: center;
				view{
					flex: 1;
					display: flex;
					align-items: center;
					justify-content: space-between;
					color: #BFBFBF;
					margin-left: 48rpx;
					image{
						width: 36rpx;
					}
				}
			}
			>view:nth-of-type(3){
				image{
					width: 28rpx!important;
				}
			}
		}
		
	}
	>.top{
		display: flex;
		padding: 18rpx 34rpx;
		align-items: flex-start;
		background: #FFF7E8;
		text{
			color: #FF8C00;
			flex: 1;
			margin: 0 17rpx;
		}
		image:nth-of-type(1){
			width: 40rpx;
		}
		image:nth-of-type(2){
			width: 23rpx;
		}
	}
	>.bot{
		padding: 13rpx 0 50rpx 0;
		display: flex;
		justify-content: center;
		background: #fff;
		text{
			width: 638rpx;
			line-height: 88rpx;
			border-radius: 88rpx;
			text-align: center;
			font-size: 32rpx;
			color: #fff;
			background: #6B64D3;
		}
	}
}
</style>